<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
  <head>
  <style type="text/css">
body {
	background-image:url('static/papercork.jpg');
	background-size: 100%;
	
	repeat: none;
	
	
}
/* list styles */
  #container {
    
    width: 100%;
    height: 35px;
    background-color: black;
	position:absolute;
	left:0px;
	top:0px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

  }
#container ul
{
margin: 0;
padding: 0;
list-style-type: none;
width: 100%;
height: 40px;
background-color: #242323;
float: left;
list-style: none;
}




#container a
{
display: block;
color: #FFF;
background-color: #242323;
width: 9em;
padding-left: 1em;
padding-right: 1 em;
text-decoration: none;
height: 30px;
}

#container a:hover
{
color: #FFF;
text-shadow: black -4px 4px 4px;
}
#container main:hover
{
color: #FFF;
text-shadow: black -4px 4px 4px;
}

#container ul li{
display: block;
  position: relative;
  float: left;
  width: 240px;
text-decoration: none;
  color: #ffffff;
padding: 10px 0px 0px 0px;
  text-align:center;
  background: #242323;
 
  white-space: nowrap;
font-size: 20px;
}
li ul { display: none; }

h2 {
font-size: 15px;
}

li:hover ul {
  display: block;
  position: absolute;

}
li:hover li {
  float: none;
  font-size: 11px;

}
/* table styles */
#tablemain {
	width: 1200px;
	height: 1200px;
padding-top: 75px;
margin-left: 45px;
margin-right: 45px;

}
td { width: 300px;
	}
tr { height: 35px}

.logo{
	background-image:url('static/smallerlogo.png');
	background repeat: none;
	width: 30px;
	height:30px;
	position: absolute; right: 25px; top: 5px; 
	z-index: 2;
	 }
	@font-face {
	    font-family: Joe;
	    src: url(joe.ttf);
	}
	.searchtext{
		font-family: Joe, Verdana, Geneva, sans-serif;
		font-size: 60 px;
		position: absolute; left:200px; top: 115px;
		font-weight: bold;
	z-index: -1;
		display: block;
		line-height:150%;
</style>


  	<title>
			Public Bulletin
		</title>

<script type=text/javascript>
function openSubmitFrame() {
  document.getElementById('submitFrame').style.display = 'block';
  document.getElementById('submitFrame').style.visibility = 'visible';
}

function closeSubmitFrame() {
  document.getElementById('submitFrame').style.display = 'none';
  document.getElementById('submitFrame').style.visibility = 'hidden';
}
</script>
</head>
	<div id="container">
    <ul>
      <li>
        <a href='/'>Bulletin Boards</a>

        <div>
          <ul>
            <li>
              <h2><a href="community.html">Community Events</a></h2>
            </li>

            <li>
              <h2><a href="school.html">School Events</a></h2>
            </li>
          </ul>
        </div>
      </li>

      <li>Submit New Sticky

        <ul>
          <li>
            <h2>Enter your note<br /></h2>

            <form action="/community.html"
                  method="post">
              Name: <input name='name' /><br />
              Message: <input name='message' /><br />
              <input type="submit" />
            </form>
          </li>
        </ul>
      </li>

      <li>Submit Image

        <ul>
          <li>
            <h2>Paste Image URL<br /></h2>

            <form action="/community.html"
                  method="post">
              Name: <input name='name' /><br />
              URL: <input name='message' /><br />
              <input type="submit" />
            </form>
          </li>
        </ul>
      </li>

      <li><a href="developer.html">Developer Information</a></li>

      <li>Search

        <ul>
          <li>
            <form action="/search"
                  method="get">
              <h2>Text: <input name='message' /><br />
              <input type="checkbox"
                     name="text"
                     value="true" />Text<br />
              <input type="checkbox"
                     name="author"
                     value="true" />Author<br />
              <input type="submit" /></h2>
            </form>
          </li>
        </ul>
      </li>
    </ul>
  </div>{% for note in Stickynotes %} {% endfor %}

  <table id='tablemain'>
    <tr>
      <td></td>

      <td>
        <div class="searchtext">
          {{ note.text }};{{ note.name }}
        </div>
      </td>
    </tr>

    <tr>
      <td></td>
    </tr>
  </table>

  <div class="logo">
    <a href="/"></a>
  </div>
</body>
</html>
